import React, {Component} from 'react';
import {
  ListView,
  View,
  Text,
  TouchableOpacity,
  StyleSheet,
} from 'react-native';

import Config from '../../config';
import BaseComponent from '../common/BaseComponent';
import BaseItem from '../common/BaseItem';
import ActivityConstants from './ActivityConstants';
import ActivityRequestListAction from '../../actions/activity/ActivityRequestListAction';

export default class ActivityPreviewListView extends BaseComponent {
    constructor(props) {
        super(props);
        this.ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
        this.state = {
            data: {},
            initTimerComplete: false,
        };
        this.initTimer = null;
    }

    componentDidMount() {
      this.initTimer = setTimeout(
        () => { this.setState({initTimerComplete:true}) },
        500
      );
      this._requestData();
    }

    render() {
      if(this.state.initTimerComplete) {
        return(
            <View style={{height: 100, backgroundColor:"#434343"}}>
                <Text>{this._getTitleText()}</Text>
                <ListView
                  horizontal = {true}
                  dataSource={this._getDataSource()}
                  renderRow={
                    (activityData) =>
                      <Item data={activityData} onPressItem={()=>this._onPressItem(activityData)}></Item>
                  }
                />
            </View>
        )
      }
      else {
        return (<View></View>)
      }
    }

    _getTitleText() {
      if(this.props.data.tag == ActivityConstants.TAG.BE) {
        return "你可能感兴趣的活动";
      }
      else if(this.props.data.tag == ActivityConstants.TAG.ING) {
        return "正在进行的活动";
      }
      else if(this.props.data.tag == ActivityConstants.TAG.DONE) {
        return "已经结束的活动";
      }
      return "标记错误";
    }

    _getDataSource() {
      var resultArr = [];
      if(this.state.data.state == 2) {
          var activityData = this.state.data.activityData;
          for(let i = 0 ; i< activityData.length ; i ++ ){
              resultArr.push(activityData[i]);
          }
      }
      // resultArr.push({
      //   activity_id: "pgycykl3e9",
      //    address: "vikc",
      //    applicants_num: 5060835792145604000,
      //    apply_content: "h2x",
      //    begin_at: "1984-01-04T22:28:42+08:00",
      //    content: "qv0m71ok4",
      //    created_at: "2010-03-10T09:19:29+08:00",
      //    created_by: "12345678",
      //    created_ee_no: 27347361,
      //    end_at: "1993-05-02T01:46:14+08:00",
      //    image_url: "http://mante.biz/jaylon",
      //    live_url: "http://kuvalis.org/dave.cassin",
      //    readers_num: 5017591407775244000,
      //    state: 1,
      //    title: "i1g73ej",
      //    updated_at: "1982-05-28T10:04:43+08:00"
      // })
      return this.ds.cloneWithRows(resultArr);
    }

    _requestData() {
        //page第几页
        //page_size每页几项
        //tag标签，0所有活动，1未开始活动，2进行中活动，3已结束活动
        new ActivityRequestListAction().call(this, {page:1, page_size:5, tag:this.props.data.tag});
    }

    _onPressItem(activityData) {
        this.props.page.gotoPage(Config.pages.activity_content, activityData);
    }
}

class Item extends BaseItem {
    render() {
        return (
            <TouchableOpacity onPress={this.props.onPressItem}>
                <View style={styleSheets.itemStyle}>
                    <Text>活动名字：{this.props.data.title}</Text>
                </View>
            </TouchableOpacity>
        );
    }
}

var styleSheets = StyleSheet.create({
    itemStyle: {
        flexDirection: 'row',
        backgroundColor: 'blue',
        width:100,
        height:50,
        borderWidth:2
    }
});
